<template>
	<view class="zai-box">
		<!-- <image src="../../static/zaizai-login/login.png" mode='aspectFit' class="zai-logo"></image> -->
		<!-- <view class="zai-title">全民防灾</view> -->
		<view class="zai-form">
			<input class="zai-input" type="number" placeholder-class placeholder="请输入手机号" v-model="phone"/>
			<input class="zai-input" placeholder-class password placeholder="请输入密码" v-model="password"/>
			<view class="zai-label">忘记密码？</view>
			<button class="zai-btn" @click="login()">立即登录</button>
			<navigator url="../register/register" hover-class="none" class="zai-label">还没有账号？点此注册.</navigator>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				phone:'',
				password:''
			}
		},
		methods:{
			login(){
				uni.request({
					url:'http://47.93.42.155:8080/WePrevent/LoginServlet',
					data:{
						phone:this.phone,
						password:this.password
					},
					success: (res) => {
						if(res.data.msg=="1"){
							uni.showToast({
							    title: "登录成功！",
							    duration: 1500,
							});	
							getApp().globalData.islogin = '1'
							getApp().globalData.name = res.data.data.uname
							getApp().globalData.password = res.data.data.upassword
							getApp().globalData.email= res.data.data.uemail
							getApp().globalData.phone= res.data.data.uphone
							getApp().globalData.uid= res.data.data.uid
							
							setTimeout(() => {
								uni.switchTab({
								    url: '../Me/Me'
								});
							}, 1700)
							
						}else{
							uni.showToast({
							    title: "登录失败！账户或密码错误！",
							    duration: 1500,
							});	
						}
						
						
					}
				})
			}
		}
	 }
</script>

<style>
	.zai-box{
		padding: 0 100upx;
		position: relative;
	}
	.zai-logo{
		width: 100%;
		width: 100%;
		height: 310upx;
	}
	.zai-title{
		position: absolute;
		top: 0;
		line-height: 360upx;
		font-size: 68upx;
		color: #fff;
		text-align: center;
		width: 100%;
		margin-left: -100upx;
	}
	.zai-form{
		margin-top: 300upx;
	}
	.zai-input{
		background: #e2f5fc;
		margin-top: 30upx;
		border-radius: 100upx;
		padding: 20upx 40upx;
		font-size: 36upx;
	}
	.input-placeholder, .zai-input{
		color: #94afce;
	}
	.zai-label{
		padding: 60upx 0;
		text-align: center;
		font-size: 30upx;
		color: #a7b6d0;
	}
	.zai-btn{
		background: #00cfa3;
		color: #fff;
		border: 0;
		border-radius: 100upx;
		font-size: 36upx;
	}
	.zai-btn:after{
		border: 0;
	}
	/*按钮点击效果*/
	.zai-btn.button-hover{
		transform: translate(1upx, 1upx);
	}
</style>
